<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>中因医院/登录页面</title>
    <link rel="stylesheet" href="/layui/css/layui.css">
    <link rel="shortcut icon" href="/images/hospital.png">
</head>
<body>

<!-- 你的 HTML 代码 -->
<div class="layui-container">
    <div class="layui-row">
        <fieldset class="layui-elem-field layui-col-md4 layui-col-md-offset4">
            <legend>登录</legend>
            <div class="layui-field-box">
                <form class="layui-form layui-form-pane">
                    <div class="layui-form-item">
                        <label class="layui-form-label">邮箱</label>
                        <div class="layui-input-block">
                            <input type="text" name="email" required="" lay-verify="email" placeholder="请输入邮箱"
                                   autocomplete="off" class="layui-input" value="1208585122@qq.com">
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">密码</label>
                        <div class="layui-input-block">
                            <input type="password" name="password" required="" lay-verify="password" placeholder="请输入密码"
                                   autocomplete="off" class="layui-input" value="123">
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <div class="layui-input-block">
                            <button class="layui-btn" lay-submit="" lay-filter="login">立即登录</button>
                            <button type="reset" class="layui-btn layui-btn-primary">重置</button>
                        </div>
                    </div>
                </form>
            </div>
        </fieldset>

    </div>
</div>

<script src="/layui/layui.js"></script>
<script>
    layui.use(['jquery', 'layer', 'form'], function () {
        var layer = layui.layer
            , form = layui.form;
        var $ = layui.jquery;

        // 表单验证
        form.verify({
            email: function (value, item) {
                if (/^\d+\d+\d$/.test(value)) {
                    return '邮箱不能全是数字';
                }
            },
            password: function (value, item) {
                if (!/^.{3,12}$/.test(value)) {
                    return '密码只能是3到12位';
                }
            }

        });

        // 提交数据
        form.on('submit(login)', function (data) {
            // 第一：需要将用户输入的账号和密码取到
            var user = {
                email: $('input[name="email"]').val(),
                password: $('input[name="password"]').val()
            };

            // 第二步：传递给后台
            $.ajax({
                url: '/dologin',
                type: 'post',
                contentType: 'application/json',
                dataType: 'json',
                data: JSON.stringify(user),
                beforeSend: function () {
                    // 开始请求前
                    layer.load(2, {
                        shade: [0.5, "#333"]
                    });
                },
                success: function (data) {
                    // 请求成功
                    // 跳转到主页面
                    if (data.status == 1) {
                        layer.msg("登录成功");
                        setTimeout(function (){
                        location.href="/main";
                        },2000);



                    } else {
                        layer.msg(data.message);
                    }
                },
                error: function () {
                    // 请求失败
                    // 提示用户
                    layer.msg("请求失败，网络异常");
                },
                complete: function () {
                    // 请求完成
                    // 关闭进度条
                    layer.closeAll("loading");
                }
            });

            return false;
        });
    });
</script>
</body>
</html>
